<template>
  <!-- 路由导航 -->
  <el-menu
    router
    unique-opened
    :default-active="computedPath"
    background-color="#2b4351"
    text-color="#fff"
    active-text-color="#00A4FF"
  >
    <el-menu-item index="/home">
      <i class="el-icon-menu"></i>
      <span slot="title">首页</span>
    </el-menu-item>
    <el-menu-item index="/order/list">
      <i class="el-icon-menu"></i>
      <span slot="title">订单管理</span>
    </el-menu-item>

    <el-submenu index="/goods">
      <template slot="title">
        <i class="el-icon-location"></i>
        <span>商品管理</span>
      </template>
      <el-menu-item index="/goods/list">商品列表</el-menu-item>
      <el-menu-item index="/goods/save">添加商品</el-menu-item>
      <el-menu-item index="/goods/type">商品分类</el-menu-item>
    </el-submenu>

    <el-menu-item index="/shop">
      <i class="el-icon-location"></i>
      <span slot="title">店铺管理</span>
    </el-menu-item>

    <el-submenu index="/users">
      <template slot="title">
        <i class="el-icon-location"></i>
        <span>账号管理</span>
      </template>
      <el-menu-item index="/users/list">账号列表</el-menu-item>
      <el-menu-item index="/users/save">添加账号</el-menu-item>
      <el-menu-item index="/users/pwd">修改密码</el-menu-item>
      <el-menu-item index="/users/personal">个人中心</el-menu-item>
    </el-submenu>

    <el-submenu index="census">
      <template slot="title">
        <i class="el-icon-location"></i>
        <span>统计管理</span>
      </template>
      <el-menu-item index="/census/order">订单统计</el-menu-item>
      <el-menu-item index="/census/goods">商品统计</el-menu-item>
    </el-submenu>
  </el-menu>
</template>

<script>
export default {
  computed: {
    computedPath() {
      return this.$route.path;
    }
  }
};
</script>

<style lang="less" scoped>
</style>